@font-face {
  font-family: 'sour';
  src: url("../fonts/SourceHanSansCN-Regular_0.otf"); }

@font-face {
  font-family: 'times';
  src: url("../fonts/Times New Roman.ttf"); }

body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td {
  margin: 0;
  padding: 0; }

body, button, input, select, textarea {
  font: 12px/1.5tahoma, arial, \5b8b\4f53; }

h1, h2, h3, h4, h5, h6 {
  font-size: 100%; }

address, cite, dfn, em, var {
  font-style: normal; }

code, kbd, pre, samp {
  font-family: couriernew, courier, monospace; }

small {
  font-size: 12px; }

ul, ol {
  list-style: none; }

a {
  text-decoration: none; }

a:hover {
  text-decoration: none; }

sup {
  vertical-align: text-top; }

sub {
  vertical-align: text-bottom; }

legend {
  color: #000; }

fieldset, img {
  border: 0; }

button, input, select, textarea {
  font-size: 100%;
  outline: none !important; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

* {
  font-family: 'sour'; }

.fl {
  float: left; }

.fr {
  float: right; }

.clearfix:after {
  content: '';
  display: block;
  clear: both; }

.container {
  max-width: 1400px;
  width: 100%;
  margin: auto; }

html,body{
  height:100%;
}
#app{
  height:100%;
}
.mCSB_scrollTools{
  z-index:99999999;
}
.header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background: #fff;
  box-shadow: 0 2px 3px #ddd;
  height: 68px;
  height: 68px;
  z-index: 9999; }
  .header .logo {
    height: 45px;
    margin-top: 11px; }
    .header .logo img {
      height: 45px;
      display: block; }

.wepnav li {
  float: left;
  height: 66px;
  line-height: 68px;
  border-bottom: 2px solid #fff;
  margin: 0 27px; }
  .wepnav li:last-of-type {
    margin-right: 0; }
  .wepnav li.active {
    border-bottom: 2px solid #6aaae8; }
  .wepnav li a {
    color: #333;
    font-size: 14px;
    font-weight: 400; }
  .wepnav li:hover a {
    color: #6aaae8; }

.search-img img {
  display: block;
  width: 20px;
  height: 20px;
  margin: 24px auto; }

.luang a {
  display: block;
  width: 24px;
  height: 18px;
  margin: 25px auto;
  background: url("../images/chanese.jpg") 100% 100%;
  transition-duration: .3s; }
  .luang a:hover {
    background: url("../images/english.jpg") 100% 100%; }

.head-info {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  transition-duration: .3s; }
  .head-info.active {
    left: -100%; }

.head-search {
  position: absolute;
  left: 100%;
  top: 0;
  width: 100%;
  height: 68px;
  background: #fff;
  z-index: 999;
  transition-duration: .3s; }
  .head-search.active {
    left: 0%; }

.head-search .content {
  padding: 0 200px;
  height: 68px; }
  .head-search .content .icon {
    padding-right: 20px;
    border-right: 1px solid #ccc;
    margin-right: 30px; }
  .head-search .content .fa-navicon {
    font-size: 32px;
    line-height: 68px;
    cursor: pointer; }
  .head-search .content .fa-navicon:hover {
    color: #6aaae8; }
  .head-search .content input {
    width: 250px;
    height: 50px;
    line-height: 50px;
    border: 0;
    margin: 9px 0;
    font-size: 20px; }
  .head-search .content button {
    width: 50px;
    height: 50px;
    border: 0;
    background: url("../images/search_01.png") center no-repeat/24px;
    margin: 9px;
    cursor: pointer; }

#navList {
  position: fixed;
  width: 100%;
  background: #f7f7f7;
  height: 380px;
  top: 68px;
  left: 0;
  display: none;
  z-index: 999; }
  #navList .container {
    padding: 70px 0; }
  #navList ul {
    justify-content: space-between;
    display: none; }
    #navList ul.active {
      display: flex; }
    #navList ul > li {
      padding-right: 60px; }
      #navList ul > li h3 {
        font-size: 16px;
        margin-bottom: 6px; }
        #navList ul > li h3 a {
          color: #222; }
          #navList ul > li h3 a:hover {
            color: #6aaae8; }
      #navList ul > li ol > li {
        font-size: 14px;
        line-height: 24px; }
        #navList ul > li ol > li a {
          color: #555; }
          #navList ul > li ol > li a:hover {
            color: #6aaae8; }
      #navList ul > li.video {
        width: 480px;
        height: 240px;
        border-left: 1px solid #e3e3e3;
        padding-right: 0px; }
        #navList ul > li.video p {
          font-size: 14px;
          color: #666;
          width: 360px;
          float: right;
          line-height: 40px; }

.plays {
  width: 360px;
  height: 200px;
  position: relative;
  float: right; }
  .plays img {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    opacity: 0;
    transition-duration: .3s; }
  .plays:hover img {
    opacity: 1; }

.banner {
  position: absolute;
  top: 68px;
  left: 0;
  width: 100%;
  height: calc(100% - 68px);
  overflow: hidden; }
  .banner .bck {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1; 
    transition-duration:0s;
  }
  .banner .bck.active{
    transition-duration:.3s;
  }
  .banner .bck img {
    display: block;
    height: 100%; 
  }

.swiper-banner {
  height: 100%; }
  .swiper-banner .container {
    height: 100%; }
  .swiper-banner ul {
    position: relative;
    height: 100%; 
    width:1400px;
  }

.swiper-banner{
  cursor:auto;
}
.swiper-banner ul li{
  z-index:100;
}
.swiper-banner ul li a{
  transition-duration:.3s;
  cursor:url('../images/cur.ico'),auto;
}

.swiper-banner ul li:first-of-type {
  position: absolute;
  width: 506px;
  height: 638px;
  top: 70px;
  left: 70px; }
.swiper-banner ul li:last-of-type {
  position: absolute;
  width: 632px;
  height: 520px;
  right: 220px;
  bottom: 0; }
.swiper-banner ul .text {
  position: absolute;
  top: -180px;
  right: -100px;
}

.swiper-banner ul .text h2{
  font-size:88px;
  font-family:times;
  color:#444;
}
.swiper-banner ul .text p{
  font-size:24px;
  font-family:times;
  color:#777;
}
.swiper-banner ul .text h3{
  font-size:32px;
  color:#444;
}

.mouse-box{
  position:absolute;
  width:100px;
  height:100px;
  z-index:101;
  top:0; left:0;
  opacity:0;
}

.mouse-box.active{
  opacity:0;
  animation:mouse .5s forwards;
  -webkit-animation:mouse .5s forwards;
  margin-left:100px;
}
@keyframes mouse{
  0%{
    margin-left:100px;
    opacity:0;
  }
  100%{
    margin-left:0px;
    opacity:1;
  }
}
@-webkit-keyframes mouse{
  0%{
    margin-left:100px;
    opacity:0;
  }
  100%{
    margin-left:0px;
    opacity:1;
  }
}

.mouse-box.out{
  opacity:1;
  margin-right:0;
  animation:outmouse .5s forwards;
  -webkit-animation:outmouse .5s forwards;
}

@keyframes outmouse{
  100%{
    margin-left:100px;
    opacity:0;
  }
}
@-webkit-keyframes outmouse{
  100%{
    margin-left:0px;
    opacity:0;
  }
}

.mouse-box h3{
  font-size: 20px;
  color:#000;
}
.mouse-box p{
  font-size:14px;
  color:#444;
}

.solite-box{
  padding:160px 0;
}

.scrollWz{
  position:fixed;
  top:0;
}

.solite-box .container{
  position:relative;
}
.solite-box .item.active{
  background:red;
}

.solite-box .container>.title{
  position:absolute;
  top:0; left:0;
}
.solite-box .title h2{
  font-size:22px;
  color:#444;
}
.solite-box .title p{
  font-size:16px;
  color:#ccc;
  font-family:times;
}

.swiper-case{
  padding:260px 0 126px;
}
.solite-box .content .swiper-slide{
  width:292px !important;
  height:246px;
}
.solite-box .content .swiper-slide.active{
  width:524px !important;
  position:relative;
}
.solite-box .content .swiper-slide .item{
  width:292px;
  position:absolute;
  bottom:0; left:0;
  transition-duration:1s;
  width:100%;
  height:100%;
  background:#fff;
}
.solite-box .content .swiper-slide.active .item{
  width:524px;
  height:634px;
  bottom:-126px;
}
.solite-box .item .title,.solite-box .item .text{
  display:none;
}
.solite-box .item .img{
  width:100%;
  height:100%;
}
.solite-box .item .img a{
  display:block;
  height:100%;
  position:relative;
}
.solite-box .item .img h3{
  position:absolute;
  height:30px;
  text-align:center;
  line-height:30px;
  top:0; bottom:0; left:0;
  width:100%;
  margin:auto;
  color:#fff;
  font-size:16px;
}
.solite-box .active .item .title,.solite-box .active .item .text{
  display:block;
}
.solite-box .active .item .img{
  height:444px;
}
.solite-box .active .item .img h3{
  display:none;
}
.solite-box .active .item .title{
  height:64px;
  line-height:64px;
  background:#4799e5;
  font-size:20px;
  color:#fff;
  text-align:center;
  font-weight:600;
}
.solite-box .active .item .text{
  background:#f2f2f2;
  height:126px;
  display:table;
  padding:0 50px;
}
.solite-box .active .item .text p{
  display:table-cell;
  vertical-align:middle;
  text-align:center;
  font-size:16px;
  color:#666;
  line-height:24px;
}
.solite-box .swiper-button-prev,.solite-box .swiper-button-next{
  top:392px;
  width:11px;
  height:21px;
  transition-duration:.3s;
  outline:none !important;
}
.solite-box .swiper-button-prev{
  left:-20px;
  background:url('../images/bind_left_icon.png') left top no-repeat;
}
.solite-box .swiper-button-next{
  right:-20px;
  background:url('../images/bind_left_icon.png') right top no-repeat;
}
.solite-box .swiper-button-prev:hover{
  background:url('../images/bind_left_icon.png') left bottom no-repeat;
}
.solite-box .swiper-button-next:hover{
  background:url('../images/bind_left_icon.png') right bottom no-repeat;
}
.solite-box .p{
  position:absolute;
  top:160px;
  left:100px;
  font-size:106px;
  color:#4a4a4a;
  font-weight:600;
  font-family:times;
}

.index-pro ul{
  overflow:hidden;
}
.index-pro li{
  float:left;
}
.index-pro li.first{
  width:595px;
  margin-right:20px;
}
.index-pro li.two{
  width:400px;
  margin-right:20px;
}
.index-pro li.last{
  width:365px;
}
.index-pro li .item{
  position:relative;
  width:100%;
}
.index-pro li.first .item{
  height:670px;
}
.index-pro li.two .item:nth-of-type(1){
  height:330px;
  margin-bottom:20px;
}
.index-pro li.two .item:nth-of-type(2){
  height:470px;
}
.index-pro li.last .item:nth-of-type(1){
  height:430px;
  margin-bottom:20px;
}
.index-pro li.last .item:nth-of-type(2){
  height:265px;
}

.index-pro .item .text{
  position:absolute;
  bottom:20px; left:0;
}
.index-pro .item h3{
  
  min-width:132px;
  padding:0 10px;
  height:36px;
  line-height:36px;
  background:#4799e5;
  text-align:center;
   color:#fff;
   font-size:18px;
}
.index-pro .item a{
  display:block;
  width:100%;
  height:100%;
}
.index-pro .item .text span{
  float:right;
  content:'';
  width:14px;
  height:36px;
  background:url('../images/pro_title_bc.png');
  margin-right:-24px;
}
.index-pro .item .text p{
  font-size:14px;
  color:#666;
  line-height:30px;
  text-align:center;
}

.index-pro .item .title{
  height:100%;
  background:#f9f9f9;
  padding:20px 35px;
  position:relative;
}
.index-pro .item .title h2{
  font-size:48px;
  color:#dadada;
  font-family:times;
}
.index-pro .item .title p{
  font-size:24px;
  color:#898989;
}
.index-pro .item .title img{
  position:absolute;
  bottom:24px; right:28px;
  transition-duration:.3s;
}
.index-pro .item .title:hover img{
  right:20px;
}

.index-model{
  margin-top:170px;
  background:url('../images/model_bc.jpg') center / cover;
  height:980px;
  overflow:hidden;
}
.index-model .container{
  position:relative;
}
.index-model .container>.title{
  position:absolute;
  left:0; top:72px;
}
.index-model .container>.title h3{
  font-size:22px;
  color:#fff;
}
.index-model .container>.title h4{
  font-size:16px;
  color:#999;
  font-family:times;
}
.index-model .container>.title p{
  font-size:16px;
  color:#666;
  margin-top:35px;
  line-height:24px;
  width:332px;
}

.index-model .content{
  height:980px;
  background:url('../images/model_box.png') bottom center no-repeat;
  position:relative;
}

.model-list{
  position:absolute;
  width:1600px;
  left:-100px;
  top:0;
  height:100%;
}
.model-list .item{
  position:absolute;
  transition-duration:1s;
}

.model-list .model{
  height:100%;
  cursor:pointer;
  position:relative;
}
.model-list .item-1,.model-list .item-5{
  width:150px;
  height:150px;
  border:1px solid rgba(255,255,255,.1);
  top:405px;
}
.model-list .item-1{
  left:-94px;
}
.model-list .item-5{
  left:1544px;
}

.model-list .item-2,.model-list .item-4{
  width:200px;
  height:200px;
  border:1px solid rgba(255,255,255,.1);
  top:380px;
}
.model-list .item-2{
  left:162px;
}
.model-list .item-4{
  left:1238px;
}
.model-list .item-3{
  width:340px;
  height:726px;
  top:128px; left:50%;
  margin-left:-172px;
  border-radius:42px;
  overflow:hidden;
  background:none !important;
}
.model-list .item iframe{
  opacity:0;
  transition-duration:1s;
  position:absolute;
  z-index:-1;
  width:100%;
  height:100%;
}
.model-list .item .title{
  display:none;
}
.model-list .item-3 iframe{
  opacity:1;
  z-index:99;
  display:block;
}
.model-list .item-3 .title{
  display:block;
  height:48px;
  position:absolute;
  bottom:80px;
  z-index:999;
  line-height:24px;
  text-align:center;
  width:100%;
}
.model-list .item-3 .title h3{
  font-size:16px;
  color:#196cba;
  font-weight:400;
}
.model-list .item-3 .title p{
  font-size:14px;
  color:#999;
}

.index-news{
  padding:80px 0;
}
.index-news .title{
  margin-bottom:60px;
}
.index-news .title h2{
  font-size:22px;
  color:#444;
}
.index-news .title p{
  font-size:16px;
  color:#ccc;
}

.index-news li{
  height:168px;
}
.index-news li .item{
  width:50%;
  box-sizing:border-box;
}
.index-news li:nth-child(2n) .item{
  padding-right:50px;
}
.index-news li:nth-child(2n-1) .item{
  padding-left:50px;
}
.index-news li .item .text{
  width:390px;
}
.index-news li .item .imgPr{
  width:0;
  position:relative;
  transition-duration:.5s;
}
.index-news li .item .img{
  width:224px;
  height:158px;
  position:absolute;
  border:5px solid #4799e5;
  top:-160px;
  z-index:-1;
  opacity:0;
  transition-duration:.5s;
}
.index-news li:nth-child(2n) .item .img{
  right:0;
}

.index-news li .item.active .imgPr{
  width:224px;
  height:158px;
}
.index-news li .item.active .img{
  top:0px;
  z-index:99;
  opacity:1;
}

.index-news li .item .img a{
  display:block;
  height:100%;
}

.index-news li:nth-child(2n) .item .text{
  padding-right:25px;
  text-align:right;
}
.index-news li:nth-child(2n-1) .item .text{
  padding-left:25px;
}
.index-news li:nth-child(2n) .item .img:after{
  position:absolute;
  content:'';
  width:7px; height:12px;
  top:50%;
  right:-12px;
  background:url('../images/icon_right_sjx.png') center / cover;
  margin-top:-6px;
}
.index-news li:nth-child(2n-1) .item .img:after{
  position:absolute;
  content:'';
  width:7px; height:12px;
  top:50%;
  left:-12px;
  background:url('../images/icon_right_sjx.png') center / cover;
  margin-top:-6px;
  transform:rotate(180deg);
}
.index-news *{
  transition-duration:.3s;
}
.index-news li .item .time p{
  font-size:48px;
  color:#ccc;
  font-family:times;
  line-height:50px;
}
.index-news li .item .time span{
  font-size:18px;
  color:#ccc;
  font-family:times;
}
.index-news li .item h3{
  font-size:16px;
  margin:10px 0;
}
.index-news li .item h3 a{
  color:#444;
}
.index-news li .item h3 a:hover{
  color:#4799e5;
}
.index-news li .item .text>p{
  font-size:14px;
  color:#999;
  line-height:24px;
}

.index-news .content{
  position:relative;
}
.scroll-ol{
  position:absolute;
  top:84px; left:50%;
  width:13px;
  height:330px;
  margin-left:-6.5px;
}

.scroll-ol *{
  box-sizing:border-box;
}

.scroll-ol .this{
  height:165px;
  position:relative;
}
.scroll-ol .this:before{
  content:'';
  width:1px;
  height:100%;
  background:#d0d0d0;
  position:absolute;
  top:0; left:0; right:0;
  margin:auto;
  z-index:-1;
}
.scroll-ol .this:last-of-type:before{
  display:none;
}
.scroll-ol .dian{
  position:relative;
  width:9px;
  height:9px;
  border:2px solid #d0d0d0;
  border-radius:50%;
  margin:auto;
  background:#fff;
  cursor:pointer;
  transition-duration:.3s;
}
.scroll-ol .dian:after{
  position:absolute;
  content:'';
  width:15px;
  height:15px;
  background:#fff;
  top:-4px; left:-4px;
  border-radius:50%;
  z-index:-1;
}

.scroll-ol .dian.active,.scroll-ol .dian:hover{
  width:13px;
  height:13px;
  border:2px solid #58a2e7;
}
.scroll-ol .dian.active:after,.scroll-ol .dian:hover:after{
  content:'';
  width:19px;
  height:19px;
  top:-6px; left:-6px;
}

.index-firend{
  margin-top:100px;
}
.index-firend .title h2{ 
  font-size:22px;
  color:#444;
}
.index-firend .title p{
  font-size:16px;
  color:#ccc;
}

.index-firend .content ul{
  margin-top:50px;
  overflow:hidden;
  padding-bottom:60px;
}
.index-firend .content li{
  width:213px;
  height:98px;
  border:1px solid #ececec;
  overflow: hidden;
  transition-duration:.3s;
  float:left;
  margin:0 22px 22px 0;
}
.index-firend .content li:nth-child(6n){
  margin:0 0px 22px 0;
}
.index-firend .content li:hover{
  border:1px solid #4799e5;
}
.index-firend .content li img{
  width:100%;
  display:block;
}

.footer{
  background:url('../images/foot_bc.jpg');
  padding:70px 0 30px;
}
.footer .content{
  margin-bottom:50px;
}
.footer ul li{
  border-right:1px solid rgba(255,255,255,.1);
  width:160px;
  float:left;
  padding-left:60px;
}
.footer ul li:nth-of-type(1){
  padding-left:0;
}

.footer ul li h3{
  font-size:14px;
  margin-bottom:12px;
}
.footer ul li h3 a{
  color:#999;
}
.footer ul li h3 a:hover{
  color:#4799e5;
}

.footer ul li p{
  font-size:14px;
  line-height:30px;
}
.footer ul li p a{
  color:#666;
}
.footer ul li p a:hover{
  color:#4799e5;
}

.footer .contact{
  width:250px;
}
.footer .contact .phone{
  margin-bottom:40px;
  text-align:center;
}
.footer .contact .phone p{
  font-size:24px;
  color:#5c98df;
  font-family:times;
}
.footer .contact .phone img{
  margin-right:5px;
}
.footer .contact .kf a{
  display:block;
  width:250px;
  height:50px;
  border:1px solid #4799e5;
  text-align:center;
  line-height:50px;
  font-size:18px;
  color:#4799e5;
}

.footer .contact .time p{
  font-size:16px;
  color:#666;
  line-height:50px;
  text-align:center;
}
.footer .contact .fx{
  text-align:center;
}
.footer .contact .fx .item{
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:50%;
  display:inline-block;
  margin:0 10px;
  transition-duration:.3s;
}
.footer .contact .fx .item a{
  display:block;
  height:100%;
}
.footer .contact .fx .item.xl{
  background:url('../images/footer_01.png') center no-repeat;
}
.footer .contact .fx .item.qq{
  background:url('../images/footer_02.png') center no-repeat;
}
.footer .contact .fx .item.wx{
  background:url('../images/footer_03.png') center no-repeat;
  position:relative;
}

.footer .contact .fx .item:hover{
  border:1px solid #4799e5;
  cursor:pointer;
}
.footer .contact .fx .item.xl:hover{
  background:url('../images/footer_001.png') center no-repeat;
}
.footer .contact .fx .item.qq:hover{
  background:url('../images/footer_002.png') center no-repeat;
}
.footer .contact .fx .item.wx:hover{
  background:url('../images/footer_003.png') center no-repeat;
}

.footer .contact .fx .item.wx .ewm{
  position:absolute;
  width:100px;
  height:100px;
  border:5px solid #fff;
  border-radius:5px;
  box-shadow:0 0 10px 0 #ccc;
  top:-230px; left:-35px;
  opacity:0;
  z-index:-1;
  transition-duration:.3s;
}
.footer .contact .fx .item.wx .ewm:after{
  content:'';
  position:absolute;
  width:20px;
  height:20px;
  background:url('../images/s.png') center / contain;
  top: 99px;
  left: 40px;
}

.footer .contact .fx .item.wx .ewm img{
  width:100%;
  height:100%;
}
.footer .contact .fx .item.wx:hover .ewm{
  opacity:1;
  z-index:9;
  top:-130px;
}

.footer .bottom{
  text-align:center;
}
.footer .bottom .foot-logo{
  margin-bottom:10px;
}
.footer .bottom  p{
  font-size:14px;
  color:#333;
  line-height:24px;
}
.footer .bottom  p a{
  color:#333;
}
.footer .bottom  p a:hover{
  color:#4799e5;
}